<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>在线留言-江西鑫磊光电科技有限公司</title>
    <meta name="keywords" content="LED,显示屏,高清小间距LED显示屏,高清,小间距,户外全彩LED显示屏,室内全彩LED显示屏,LED照明,LED显示解决方案,大屏幕,LED显示屏生产厂家,LED显示屏报价，江西LED显示屏报价">
    <meta name="description" content="江西鑫磊光电科技有限公司是一家专业从事LED产品应用研发、设计、生产、销售和服务于一体的产品服务商。">
    <link rel="stylesheet" href="./zhanshi.css">
    <link rel="shortcut icon" href="./images/ifavion.ico">
    <script src="./js/jquery-3.6.0.min.js"></script>
    <script src="./static/layer-v3.5.1/layer/layer.js"></script>
</head>

<body>
    <div class="zhanshi">
        <!-- 顶部,导航栏开始 -->
        <?php include "./header.php" ?>
        <!-- 顶部,导航栏结束 -->
        <!-- 主体部分开始 -->
        <div class="main">
            <div>
                <!--aboutus banner开始 -->
                <div class="aboutus_banner">
                    <div>
                        <h4>MESSAGE</h4><br><span>在线留言</span>
                    </div>

                </div>
                <!-- banner结束 -->
                <!-- aboutus  主体部分开始 -->
                <div class="aboutus_main clearfix">
                    <div class="aboutus_left">
                        <div class="left_top clearfix">
                            <p>M</p>
                            <h3><span>essage</span><br>在线留言</h3>
                        </div>
                        <ul>
                            <li>
                                <a href="" class="active">在线留言</a>
                            </li>
                        </ul>
                    </div>
                    <div class="aboutus_right">
                        <div class="right_top clearfix">
                            <h3>在线留言</h3>
                            <p>您的位置：首页 > 在线留言</p>
                        </div>
                        <div class="message">
                            <h2>在线留言</h2>
                            <form action="./admin/message/save.php" method="post">
                                <h3>您的详细信息</h3>
                                <input type="text" placeholder="您的姓名" class="edgeDistance" name="yourName">
                                <input type="text" placeholder="联系电话" name="tel" id="tel"><br>
                                <input type="text" placeholder="即时QQ" class="edgeDistance" name="QQ">
                                <input type="email" placeholder="电子邮件" name="email" id="email">
                                <h4>您的详细信息</h4>
                                <input type="text" placeholder="留言标题" class="info" name="title">
                                <textarea name="content" id="" cols="30" rows="10" placeholder="留言内容"></textarea>
                                <input type="button" value="确认提交" class="btn">
                            </form>
                        </div>
                        <script>
                            /*校验电话码格式 */
                            function isTelCode(str) {
                                var reg= /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/;
                                return reg.test(str);
                            }

                            /*校验邮件地址是否合法 */
                            function IsEmail(str) {
                                var reg=/^\w+@[a-zA-Z0-9]{2,10}(?:\.[a-z]{2,4}){1,3}$/;
                                return reg.test(str);
                            }
                            $(function(){

                                $("input,textarea").on("focus",function () {
                                    $(this).addClass("focus").siblings().removeClass("focus");
                                })
                                
                                $("input,textarea").on("blur",function () {
                                    $(this).removeClass("focus");
                                })
                                $("input[name='tel']").on("blur",function () {
                                    var tel=$(this).val();
                                    if (!isTelCode(tel)) {
                                        layer.tips('电话号码不正确', '#tel',{
                                            tips:[1,'red']
                                        });
                                        $(this).focus();
                                    }
                                })
                                $("input[name='email']").on("blur",function () {
                                    var email=$(this).val();
                                    if (!IsEmail(email)) {
                                        layer.tips('电子邮件不正确', '#email',{
                                            tips:[1,'red']
                                        });
                                        $(this).focus();
                                    }
                                })
                                $(".btn").on("click",function () {
                                    var data = $("form").serialize();
                                    $.ajax({
                                        method:"post",
                                        url:"./admin/message/save.php",
                                        data:data,
                                        dataType:"json",
                                        success:function (res) {
                                        if (res.code==0) {
                                            layer.open({
                                                title: '信息'
                                                ,content: res.msg
                                                ,icon:1
                                                // 子页面关闭后，重新加载父窗口
                                                ,end:function () {
                                                    location.reload();
                                                }
                                            }); 
                                        }else if (res.code==1) {
                                            layer.open({
                                                title: '信息'
                                                ,content: res.msg
                                                ,icon:2
                                                ,end:function () {
                                                    if (res.yourName=='') {
                                                        $("input[name='yourName']").focus();
                                                    }
                                                    if (res.tel=='') {
                                                        $("input[name='tel']").focus();
                                                    }
                                                    
                                                }
                                            }); 
                                        }
                                            
                                        
                                        // alert(res.msg);                          
                                        }
                                    })
                                })
                            })

                        </script>

                    </div>

                </div>
                <!-- aboutus  主体部分结束 -->
            </div>
        </div>
        <!-- 主体部分结束 -->
        <!-- 底部开始 -->
        <?php include "./bottom.php" ?>
        <!-- 底部结束 -->
    </div>
</body>

</html>